<template>
    <BasicDrawer @register="registerBaseDrawer" title="表单数据" width="70%" destroyOnClose>
       <BasicTable @register="registerTable">
        <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" />
      </template>
      </BasicTable>
    </BasicDrawer>
    <DesignFromShowModal @register="registerModal"></DesignFromShowModal>
  </template>
  <script lang="ts" setup>
    import { ref, watch, unref } from 'vue';
    import { BasicTable, useTable, TableAction } from '/src/components/Table';
    import { BasicDrawer,  useDrawerInner } from '/src/components/Drawer';
    import {list} from '../DesignFormItemR.api';
    import {columns,searchFormSchema} from '../DesignFormItemR.data';
    const emit = defineEmits(['register', 'hideUserList']);
    import DesignFromShowModal from './DesignFromShowModal.vue'
    import {useModal} from '/@/components/Modal';

    const [registerModal, {openModal}] = useModal();
    const [registerBaseDrawer] = useDrawerInner(async (data) => {
        console.log("data",data.record);
        //先注释 不传参数
        // searchFormSchema[0].defaultValue=data.record.id;
    });

    const [registerTable] = useTable({
      title: '表单数据',
      api: list,
      columns: columns,
      striped: true,
      useSearchForm: true,
      showTableSetting: true,
      clickToRowSelect: false,
      bordered: true,
      actionColumn: {
                width: 160,
               fixed:'right',
               slots: { customRender: 'action' },
            },
      showIndexColumn: true,
      tableSetting: { fullScreen: true },
      canResize: false,
      rowKey: 'id',
      formConfig: {
      labelWidth: 60,
      schemas: searchFormSchema,
      autoSubmitOnEnter: true,
    },
    });
    function handleDetail(record: Recordable) {
        record.isShow=false;
        record.designFromJson=record.formJson;
        openModal(true, {
        record,
        isUpdate: true,
        showFooter: false,
        });
   }
    function getTableAction(record) {
    return [
      {
        label: '查看数据',
        onClick: handleDetail.bind(null, record),
      },
    ];
  }
  </script>
  
  <style scoped>
    /*update-begin---author:wangshuai ---date:20230703  for：【QQYUN-5685】3、租户角色下,查询居左显示*/
    :deep(.ant-form-item-control-input-content){
      text-align: left;
    }
    /*update-end---author:wangshuai ---date:20230703  for：【QQYUN-5685】3、租户角色下,查询居左显示*/
  </style>
  